diff options
| author | real-zephex <[email protected]> | 2024-04-10 18:55:59 +0530 |
|---|---|---|
| committer | real-zephex <[email protected]> | 2024-04-10 18:55:59 +0530 |
| commit | 0be532e70aaec7b9ee7650956f9605f54912c01b (patch) | |
| tree | 1e190f623e2e76d6df66ee39c783cecbc770c135 /src/app/anime/[id] | |
| parent | UI changes (diff) | |
| download | dramalama-0be532e70aaec7b9ee7650956f9605f54912c01b.tar.xz dramalama-0be532e70aaec7b9ee7650956f9605f54912c01b.zip | |
tried to fix auto resizing of the video player on quality change.
Diffstat (limited to 'src/app/anime/[id]')
| -rw-r--r-- | src/app/anime/[id]/buttons.jsx | 50 | ||||
| -rw-r--r-- | src/app/anime/[id]/info.module.css | 12 |
2 files changed, 33 insertions, 29 deletions
diff --git a/src/app/anime/[id]/buttons.jsx b/src/app/anime/[id]/buttons.jsx index 3ce44e2..eac1884 100644 --- a/src/app/anime/[id]/buttons.jsx +++ b/src/app/anime/[id]/buttons.jsx @@ -55,30 +55,32 @@ export default function Button({ data2: info }) { } }} > - <MediaPlayer - title="dramaPlayer" - src={videoLink} - aspectRatio="16/9" - load="eager" - className={styles.VideoPlayer} - playsInline - id="videoPlayer" - volume={0.2} - onQualityChange={(event) => - console.log("changed qualities", event) - } - > - <MediaProvider /> - <PlyrLayout icons={plyrLayoutIcons} /> - </MediaPlayer> - <button - className={styles.closeButton} - onClick={() => { - setVideoLink(""); - }} - > - Close - </button> + <div className={styles.video}> + <MediaPlayer + title="dramaPlayer" + src={videoLink} + aspectRatio="16/9" + load="eager" + className={styles.VideoPlayer} + playsInline + id="videoPlayer" + volume={0.2} + onQualityChange={(event) => + console.log("changed qualities", event) + } + > + <MediaProvider /> + <PlyrLayout icons={plyrLayoutIcons} /> + </MediaPlayer> + <button + className={styles.closeButton} + onClick={() => { + setVideoLink(""); + }} + > + Close + </button> + </div> </div> )} </main> diff --git a/src/app/anime/[id]/info.module.css b/src/app/anime/[id]/info.module.css index 15fd0cd..c65e796 100644 --- a/src/app/anime/[id]/info.module.css +++ b/src/app/anime/[id]/info.module.css @@ -137,7 +137,7 @@ font-family: "Poppins", serif; font-size: 16px; background-color: var(--pastel-red); - padding: 4px 10px; + padding: 0.5rem 1.5rem; border: 0; outline: 0; border-radius: 0.5rem; @@ -145,11 +145,13 @@ margin: 5px; } -.VideoPlayer { - width: 60dvw; - height: auto; +.video { + width: 60vw; } +.VideoPlayer { + width: 100%; +} @media screen and (max-width: 768px) { @@ -161,7 +163,7 @@ font-size: 14px; } - .VideoPlayer { + .video { width: 100%; } }
\ No newline at end of file |